$(function(){
    var option = {
        url: '../sys/role/list',
        pagination: true,	//显示分页条
        sidePagination: 'server',//服务器端分页  传递 limit（pageSize）=10 & offset（startIndex） =0
        showRefresh: true,  //显示刷新按钮
        search: true,//搜索
        toolbar: '#toolbar', //工具
        striped : true,     //设置为true会有隔行变色效果
        //idField: 'userId',
        columns: [
            {
                field: 'userId',//json 的 key
                title: '序号',
                width: 40,
                formatter: function(value, row, index) {
                    var pageSize = $('#table').bootstrapTable('getOptions').pageSize;
                    var pageNumber = $('#table').bootstrapTable('getOptions').pageNumber;
                    return pageSize * (pageNumber - 1) + index + 1;
                }
            },
            {checkbox:true},
            { title: '用户ID', field: 'userId',sortable:true},
            {field:'username', title:'角色名称'
                // formatter: function(value,row){
                    // if(row.type === 0){
                    //     return value;
                    // }
                    // if(row.type === 1){
                    //     return '<span style="margin-left: 40px;">├─ ' + value + '</span>';
                    // }
                    // if(row.type === 2){
                    //     return '<span style="margin-left: 80px;">├─ ' + value + '</span>';
                    // }
                // }
                },
            { title: '邮箱', field: 'email'},
            { title: '创建者ID', field: 'createUserId'
                // , formatter: function(value){
                //     return value == null ? '' : '<i class="'+value+' fa-lg"></i>';
                // }
                },
            { title: '电话号码', field: 'mobile'},
            { title: '创建时间', field: 'createTime'},
            { title: '角色id', field: 'roleId'},
            { title: '角色名', field: 'roleName'},
            { title: '备注', field: 'remark'},
        ]};
    $('#table').bootstrapTable(option);
    //$("#table").bootstrapTable({
    // url"",
     //pagination:true,
     //   column:[[{},{}]]
    // });
});
var ztree;

var vm = new Vue({
	el:'#dtapp',
    data:{
        showList: true,
        title: null,
        menu:{}
    },
    methods:{
        del: function(){
            var rows = getSelectedRows();
            if(rows == null){
                return ;
            }
            var id = 'userId';
            //提示确认框
            layer.confirm('您确定要删除所选数据吗？', {
                btn: ['确定', '取消'] //可以无限个按钮
            }, function(index, layero){
                var ids = new Array();
                //遍历所有选择的行数据，取每条数据对应的ID
                $.each(rows, function(i, row) {
                    ids[i] = row[id];
                });

                $.ajax({
                    type: "POST",
                    url: "/sys/role/del",
                    data: JSON.stringify(ids),
                    success : function(r) {
                        if(r.code === 0){
                            layer.alert('删除成功');
                            $('#table').bootstrapTable('refresh');
                        }else{
                            layer.alert(r.msg);
                        }
                    },
                    error : function() {
                        layer.alert('服务器没有返回数据，可能服务器忙，请重试');
                    }
                });
            });
        },
        add: function(){
            vm.showList = false;
            vm.title = "新增";
            vm.menu = {};
            vm.getMenu();
        },
        update: function (event) {
            var id = 'userId';
            var userId = getSelectedRow()[id];
            if(userId == null){
                return ;
            }

            $.get("../sys/role/info/"+userId, function(r){
                vm.showList = false;
                vm.title = "修改";
                vm.menu = r.menu;

                vm.getMenu();
            });
        },
        save: function (event) {
            var url = vm.menu.userId == null ? "../sys/role/save" : "../sys/role/update";
            $.ajax({
                type: "POST",
                url: url,
                data: JSON.stringify(vm.menu),
                success: function(r){
                    if(r.code === 0){
                        layer.alert('操作成功', function(index){
                            layer.close(index);
                            vm.reload();
                        });
                    }else{
                        layer.alert(r.msg);
                    }
                }
            });
        },
        reload: function (event) {
            vm.showList = true;
            $("#table").bootstrapTable('refresh');
        },
        // menuTree: function(){
        //     layer.open({
        //         type: 1,
        //         offset: '50px',
        //         skin: 'layui-layer-molv',
        //         title: "选择菜单",
        //         area: ['300px', '450px'],
        //         shade: 0,
        //         shadeClose: false,
        //         content: jQuery("#menuLayer"),
        //         btn: ['确定', '取消'],
        //         btn1: function (index) {
        //             var node = ztree.getSelectedNodes();
        //             //选择上级菜单
        //             vm.menu.parentId = node[0].userId;
        //             vm.menu.parentName = node[0].name;
        //
        //             layer.close(index);
        //         }
        //     });
        // },
        getMenu: function(userId){

            var setting = {
                data: {
                    simpleData: {
                        enable: true,
                        idKey: "userId",
                        pIdKey: "parentId",
                        rootPId: -1
                    },
                    key: {
                        url:"nourl"
                    }
                }
            };

            //加载菜单树
            // $.get("../sys/role/select", function(r){
            //     //设置ztree的数据
            //     ztree = $.fn.zTree.init($("#menuTree"), setting, r.menuList);
            //
            //     //编辑（update）时，打开tree，自动高亮选择的条目
            //     var node = ztree.getNodeByParam("userId", vm.menu.parentId);
            //     //选中tree菜单中的对应节点
            //     ztree.selectNode(node);
            //     //编辑（update）时，根据当前的选中节点，为编辑表单的“上级菜单”回填值
            //     vm.menu.parentName = node.name;
            // });
        }
    }
});